<template>
	<el-form label-width="170px" :model="form" :rules="rules" ref="queryForm">
		<el-row>
			<el-col :span="12">

				<el-form-item label="工程名字" prop="name">
					<el-input v-model="form.name" style="width: 190px;"></el-input>
				</el-form-item>

				<el-form-item label="工程类型" prop="type">
					<el-input v-model="form.type" style="width: 190px;"></el-input>
				</el-form-item>

				<el-form-item label="设计平时用途" prop="ordinary">
					<el-input v-model="form.ordinary" style="width: 190px;"></el-input>
				</el-form-item>

				<el-form-item label="位置_经度" prop="longitude">
					<el-input v-model="form.longitude" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'longitude', 12)"></el-input>
				</el-form-item>

				<el-form-item label="位置_海拔" prop="elevation">
					<el-input v-model="form.elevation" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'elevation', 2)"></el-input>
				</el-form-item>
				
				<el-form-item label="总建筑面积" prop="coveredArea">
					<el-input v-model="form.coveredArea" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'coveredArea', 2)"></el-input>
				</el-form-item>
				
				<el-form-item label="使用面积" prop="usableArea">
					<el-input v-model="form.usableArea" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'usableArea', 2)"></el-input>
				</el-form-item>
				
				<el-form-item label="防爆单元数量" prop="explosion">
					<el-input v-model="form.explosion" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'explosion', 0)"></el-input>
				</el-form-item>
				
				<el-form-item label="战时掩蔽人数" prop="wartimeShelter">
					<el-input v-model="form.wartimeShelter" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'wartimeShelter', 0)"></el-input>
				</el-form-item>
				
				<el-form-item label="物资贮存空间" prop="goods">
					<el-input v-model="form.goods" style="width: 190px;"></el-input>
				</el-form-item>
				
				<el-form-item label="所属单位" prop="affiliatedUnit">
					<el-input v-model="form.affiliatedUnit" style="width: 190px;"></el-input>
				</el-form-item>
				
				<el-form-item label="工程隶属" prop="engineeringBelongs">
					<el-select v-model="form.engineeringBelongs" size="default" placeholder="请选择"
						style="width: 190px" clearable filterable>
						<el-option v-for="item in gclsOptions" :key="item.dictValue" :label="item.dictLabel"
							:value="item.dictValue" />
					</el-select>
				</el-form-item>
				
				<el-form-item label="防核武器抗力级别" prop="preNuclearClass">
					<el-input v-model="form.preNuclearClass" style="width: 190px;"></el-input>
				</el-form-item>
				
				<el-form-item label="防化级别" prop="preCmldefClass">
					<el-input v-model="form.preCmldefClass" style="width: 190px;"></el-input>
				</el-form-item>
				
				<el-form-item label="斜坡式人员出入口数量" prop="slope">
					<el-input v-model="form.slope" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'slope', 0)"></el-input>
				</el-form-item>
				
				

			</el-col>
			<el-col :span="12">

				<el-form-item label="工程完好程度" prop="code">
					<!-- <el-input v-model="form.code" style="width: 190px;"></el-input> -->
					<el-select v-model="form.code" size="default" placeholder="请选择"
						style="width: 190px" clearable filterable>
						<el-option v-for="item in gcbmOptions" :key="item.dictValue" :label="item.dictLabel"
							:value="item.dictValue" />
					</el-select>
					
					
					
				</el-form-item>

				<el-form-item label="设计战时用途" prop="wartime">
					<el-input v-model="form.wartime" style="width: 190px;"></el-input>
				</el-form-item>

				<el-form-item label="工程代号" prop="eCode">
					<el-input v-model="form.eCode" style="width: 190px;"></el-input>
				</el-form-item>

				<el-form-item label="位置_纬度" prop="latitude">
					<el-input v-model="form.latitude" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'latitude', 12)"></el-input>
				</el-form-item>

				<el-form-item label="位置_详细地址" prop="detailedAddress">
					<el-input v-model="form.detailedAddress" style="width: 190px;"></el-input>
				</el-form-item>
				
				<el-form-item label="口部建筑面积" prop="oralArea">
					<el-input v-model="form.oralArea" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'oralArea', 2)"></el-input>
				</el-form-item>
				
				<el-form-item label="防护单元数量" prop="entrench">
					<el-input v-model="form.entrench" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'entrench', 0)"></el-input>
				</el-form-item>
				
				<el-form-item label="口部数量" prop="oralNumber">
					<el-input v-model="form.oralNumber" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'oralNumber', 0)"></el-input>
				</el-form-item>
				
				<el-form-item label="战时车辆储备数量" prop="wartimeCar">
					<el-input v-model="form.wartimeCar" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'wartimeCar', 0)"></el-input>
				</el-form-item>
				
				<el-form-item label="批准机关及文号" prop="approval">
					<el-input v-model="form.approval" style="width: 190px;"></el-input>
				</el-form-item>
				
				<el-form-item label="管理单位" prop="managementUnit">
					<el-input v-model="form.managementUnit" style="width: 190px;"></el-input>
				</el-form-item>
				
				<el-form-item label="构筑分类" prop="buildClassify">
					<el-select v-model="form.buildClassify" size="default" placeholder="请选择"
						style="width: 190px" clearable filterable>
						<el-option v-for="item in gzflOptions" :key="item.dictValue" :label="item.dictLabel"
							:value="item.dictValue" />
					</el-select>
				</el-form-item>
				
				<el-form-item label="防常规武器等级" prop="preWeaponClass">
					<el-input v-model="form.preWeaponClass" style="width: 190px;"></el-input>
				</el-form-item>
				
				<el-form-item label="阶梯式人员出入口数量" prop="ladder">
					<el-input v-model="form.ladder" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'ladder', 0)"></el-input>
				</el-form-item>
				
				<el-form-item label="坑道水平人员出入口数量" prop="gallery">
					<el-input v-model="form.gallery" style="width: 190px;"
					@input="e => regOnlyNumSpot(e, form, 'gallery', 0)"></el-input>
				</el-form-item>

				

			</el-col>
		</el-row>
		<div style="display: flex;justify-content: flex-end;">
			<el-button @click="closethis()" @keyup.prevent @keydown.enter.prevent>取消</el-button>
			<el-button type="primary" @click="submit(queryForm)" @keyup.prevent @keydown.enter.prevent>确定</el-button>
		</div>
	</el-form>
</template>

<script setup>
	import {
		ref,
		reactive,
		onMounted
	} from 'vue'
	import {
		ElMessage
	} from 'element-plus'

	import {
		commonInterface
	} from '@/api/common/common'
	
	import {
		regOnlyNumSpot
	} from '@/utils/reg'



	const emit = defineEmits(['getList', 'closeWindow'])
	const props = defineProps(['editData', 'gclsOptions','gzflOptions','gcbmOptions'])

	const form = ref({})

	const queryForm = ref('')

	const gclsOptions = ref()
	const gzflOptions = ref()
	const gcbmOptions = ref()

	//必填项
	const rules = reactive({
		
		name: [{
			required: true,
			message: "此选项不能为空!",
			trigger: "blur"
		}]

	})
	//取消
	const closethis = () => {
		emit('closeWindow')
	}

	//确定
	const submit = async (e) => {
		if (!e) return
		await e.validate((valid) => {
			if (valid) {
				let method = 'post'
				if (props.editData) method = 'put'
				commonInterface('/back/renfang/ssyb/engineering/', form.value, method).then(result => {
					if (result.code === 200) {
						ElMessage.success(result.msg)
						emit('closeWindow')
						emit('getList')
					} else {
						ElMessage.error(result.msg)
					}
				})
			}
		})
	}

	onMounted(() => {
		gclsOptions.value = props.gclsOptions
		gzflOptions.value = props.gzflOptions
		gcbmOptions.value = props.gcbmOptions
		if (props.editData) form.value = props.editData
	})
</script>

<style>
</style>